<template>
  <div style="width:500px;margin:10px auto 0 auto;background:#efefef;padding:30px 0 0 30px; border-radius:45px">
      <div style="font-size:20px;">个人信息</div>
       <div style="width:100%;text-align:center">
           <el-avatar icon="el-icon-user-solid" :size="60"></el-avatar>
       </div>
       <div class="userInfo">
           <div>
               <span>账号：</span>
               <span>{{userData.accountNumber}}</span>
           </div>
           <div>
               <span>姓名：</span>
               <span>{{userData.name}}</span>
           </div>
           <div>
               <span>身份：</span>
               <span>{{userData.type === '0'?'管理员':'业主'}}</span>
           </div>
           <div>
               <span>身份证号：</span>
               <span>{{userData.idCard}}</span>
           </div>
           <div>
               <span>手机号：</span>
               <span>{{userData.phone}}</span>
           </div>
           <div>
               <span>性别：</span>
               <span>{{userData.gender === 0?'男':'女'}}</span>
           </div>
           <div>
               <span>住址：</span>
               <span>{{`${userData.buildingNumber}号楼-${userData.unitNumber}单元-${userData.houseNumber}`}}</span>
           </div>
           <div>
               <span>出生年月日：</span>
               <span>{{userData.birthday}}</span>
           </div>
       </div>
  </div>
</template>

<script>
export default {
    data(){
        return{
            userData:{}
        }
    },
    created(){
        this.userData = JSON.parse(window.sessionStorage.getItem('userInfo'))
    },
    mounted(){

    },
    methods:{

    }
}
</script>

<style scoped>
.userInfo{
    height: 500px;
    width: 500px;
    display: flex;
    flex-direction: column;
    align-content:center;
    padding-left: 20px;
}
.userInfo div{
    height: 50px;
    line-height: 50px;
}
</style>